import api from "./../../assets/js/request/api/index";
import Vue from "vue";
const modulePage = {
  state: {
    del_footer_banner: "",
    delBanners: "",
    delMudeules: "",
    bannerNowIndex: 0,
    allbanner: [], //所有广告存放在这里

    active: null, //当前选中项
    moduledata: {},

    //模块类别

    banner: {}, //广告

    menulist: [], //返回的菜单种类
    data: {
      headericon: {
        style: "",
        banner: [],
      }, //头部
      footer: {
        banner: [],
      }, //底部
      menu: {}, //"导航"

      group: {}, //"拼团"
      knowledge: {}, //"知识付费"

      news: {}, //"资讯"
      presale: {}, // "预售商品"
      product: {}, // "商品"
      slides: {}, //"幻灯片"
      spike: {}, // "秒杀商品"
      supplier: {}, //"商户列表"
      text: {}, //"文本"
      tour: {}, //"旅游商品"
    },
  },
  mutations: {
    //--------------------底部菜单栏--------------------------
    add_footer(state, obj) {
      state.moduledata.footer.push({
        desc: "",
        links: "",
        piclink: "",
        show: "1",
        sort: "",
        title: "",
      });
    },
    del_footer(state, obj) {
      state.moduledata.footer.splice(obj.index, 1);

      state.del_footer_banner += obj.id + "@";
    },
    edit_footer(state, obj) {
      //设置广告里banner的属性
      Vue.set(state.moduledata.footer[obj.index], obj.name, obj.val);
    },

    //--------------------广告--------------------------
    addbanner_shopitem(state, shop) {
      state.allbanner[state.bannerNowIndex]["banner"].unshift(shop);
    },
    del_sonbanner_item(state, obj) {
      //设置广告里banner的属性
      state.allbanner[obj.key]["banner"].splice(obj.index, 1);
      state.delBanners += obj.id + "@";
    },
    set_sonbanner_item(state, obj) {
      //设置广告里banner的属性
      Vue.set(state.allbanner[obj.key]["banner"][obj.index], obj.name, obj.val);
    },

    sortbanner_son(state, obj) {
      //排序广告里的子模块
      state.allbanner[obj.key]["banner"][obj.index1] = state.allbanner[obj.key][
        "banner"
      ].splice(
        obj.index2,
        1,
        state.allbanner[obj.key]["banner"][obj.index1]
      )[0];
    },

    addbanner_sondata(state, index) {
      //添加广告里的子模块
      state.allbanner[index]["banner"].push({
        piclink: "",
        links: "",
        title: "",
        id: 0,
        show: "1",
        desc: "",
        sort: "",
        style: "",
      });
    },

    set_sonbanner_name(state, obj) {
      //设置广告里的属性
      Vue.set(state.allbanner[obj.key], obj.name, obj.val);
    },

    setbannerNowIndex(state, index) {
      state.bannerNowIndex = index;
    },

    remnovebanner(state, obj) {
      //删除广告模块
      console.log(obj.id);
      if (obj.id != 0) {
        state.delMudeules += obj.id + "@";
        state.bannerNowIndex = -1;
        state.active = "top";
      }
      state.allbanner.splice(obj.index, 1);
    },

    insertbanner(state, obj) {
      // 插入广告模块
      console.log(obj.index);

      console.log(state.bannerNowIndex);
      state.allbanner.splice(obj.index + 1, 0, obj.val);
      state.active = "";
      state.bannerNowIndex = obj.index + 1;
    },

    sequencebanner(state, obj) {
      //排序广告里的子模块
      state.allbanner[obj.index1] = state.allbanner.splice(
        obj.index2,
        1,
        state.allbanner[obj.index1]
      )[0];
    },
    //添加广告模块
    addAllbanner(state, obj) {
      console.log(obj, state, state.allbanner);
      state.allbanner.push(obj);
    },

    //-----------------------------------------------------

    setModuleName(state, obj) {
      // 设置模板属性 如show style
      //  @key  @name   @val
      Vue.set(state.data[obj.key], [obj.name], obj.val);
    },

    sortBanner(state, obj) {
      //banner互换位置
      //@ key  @index @status up | down
      state.data[obj.key]["banner"][obj.index1] = state.data[obj.key][
        "banner"
      ].splice(obj.index2, 1, state.data[obj.key]["banner"][obj.index1])[0];
    },

    setBanner(state, obj) {
      state.data[obj.key]["banner"][obj.index][obj.name] = obj.val;
    },
    delBanner(state, obj) {
      state.data[obj.key]["banner"].splice(obj.index, 1);
      state.delBanners += obj.id + "@";
    },

    //组件添加banner
    addBanner(state, key) {
      state.data[key]["banner"].push({
        piclink: "",
        links: "",
        title: "",
        id: 0,
        show: "1",
        desc: "",
        sort: "",
        style: "",
      });
    },
    //设
    setObjdata(state, obj) {
      Vue.set(state.data, obj.title, obj.content);
      // console.log(state.data);
    },
    //设置导航栏
    setheadericon(state, obj) {
      state.data.headericon.banner[obj.index][obj.name] = obj.val;
    },
    //基础设置
    setbaseedit(state, obj) {
      console.log(obj);
      // state.moduledata[obj.label] = obj.value;
      Vue.set(state.moduledata, obj.label, obj.val);
    },

    //----------------------------------
    setActive(state, types, index) {
      console.log(types, index);
      state.active = types;
      if (
        !(
          types == "top" ||
          types == "slides" ||
          types == "menu" ||
          types == "headericon" ||
          types == "footer"
        )
      ) {
        state.allbanner[state.bannerNowIndex].types = types;
      } else {
        state.bannerNowIndex = -1;
      }
    },

    //
    clearObjdata(state) {
      state.delMudeules = "";
      state.delBanners = "";
      state.del_footer_banner = "";
      state.allbanner = [];
      state.data = {};
    },

    setMenulist(state, list) {
      state.menulist = list;
    },

    setModule(state, data) {
      state.moduledata = data;
    },
  },
  actions: {
    //初始化
    getModule(context, obj) {
      context.commit("clearObjdata");
      var menu = {
        headericon: "头部图标",
        slides: "幻灯片",
        menu: "导航栏",
        // footer: "底部导航栏"
      };
      api.getPage.getIndexModules({}).then((re) => {
        if (re.data.code == 200) {
          context.commit("setMenulist", re.data.result);
          //设置初始化属性
          for (const key in menu) {
            var data = {};
            console.log(key);
            if (key == "headericon") {
              data = {
                title: key,
                content: {
                  types: key,
                  show: "1",
                  banner: [
                    {
                      title: "",
                      links: "",
                      text: "头部菜单左分类",
                      show: "1",
                      piclink: "",
                    },
                    {
                      title: "",
                      links: "",
                      text: "头部菜单左分类",
                      show: "1",
                      piclink: "",
                    },
                  ],
                },
              };

              context.commit("setObjdata", data);
            } else if (key == "slides" || key == "menu" || key == "footer") {
              data = {
                title: key,
                content: {
                  title: "",
                  types: key,
                  show: 1,
                  banner: [],
                },
              };
              context.commit("setObjdata", data);
            } else {
              // data = {
              //   title: key,
              //   content: {
              //     types: key,
              //     show: "1",
              //     banner: [],
              //   },
              // };
            }
          }

          api.getPage.getEditIndexListItem(obj).then((res) => {
            if (res.data.code == 200) {
              context.commit("setModule", res.data.result);
              res.data.result.module.forEach((item, i) => {
                if (
                  item.types == "top" ||
                  item.types == "slides" ||
                  item.types == "menu" ||
                  item.types == "headericon"
                ) {
                  //除了广告其余固定的模块
                  var obj = {};
                  obj.title = item.types;
                  obj.content = item;
                  context.commit("setObjdata", obj);
                } else {
                  //广告的操作
                  console.log(item);
                  context.commit("addAllbanner", item);
                }
              });
            }
          });
        }
      });
    },
  },
};

export default modulePage;
